// 定义全局变量及函数
@import "icon.css";
// 默认背景颜色
@headBgColor:#fff;

//默认主色调
@mainColor:#4d9dff;

//默认边框颜色
@borderColor:#dadee5;

//默认panel背景颜色
@panelBgColor:#fff;

//头部高度
@headHeight:80px;

//头部默认字体颜色
@headFontColor:#1d3650;

//背景颜色
@backgroundColor:#eaf0f6;

// 一些通用配色
@greenColor: #87d04d;

// 阴影颜色
@shadowColor: #b7c6d5;

// icon配色
@subTitleColor: #677a8c;

//圆点颜色
@circle1:@mainColor;
@circle2:@greenColor;
@circle3:#f9a005;
@circle4:#f6d917;

//最小页面宽度
.min-width(@w:1000px){
	min-width: @w;
}
.btn-hidden {
	display:none;
}
//默认圆角
.border-radius(@r:3px){
	border-radius: @r;
	-webkit-border-radius:@r;
	-moz-border-radius:@r;
	-ms-border-radius:@r;
	-o-border-radius:@r;
}

//默认阴影
.box-no-shadow() {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
}

.box-shadow(@x: 0px, @y: 3px, @blur: 5px, @alpha: 0.5) {
    -webkit-box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
    -moz-box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
    -ms-box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
    -o-box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
    box-shadow: @x @y @blur rgba(0, 0, 0, @alpha);
}

.box-shadowcolor(@x: 0px, @y: 1px, @blur: 5px,@color:@mainColor, @alpha: 0.5){
	-webkit-box-shadow: @x @y @blur rgba(red(@color), green(@color), blue(@color), @alpha);
    -moz-box-shadow: @x @y @blur rgba(red(@color), green(@color), blue(@color), @alpha);
    -ms-box-shadow: @x @y @blur rgba(red(@color), green(@color), blue(@color), @alpha);
    -o-box-shadow: @x @y @blur rgba(red(@color), green(@color), blue(@color), @alpha);
    box-shadow: @x @y @blur rgba(red(@color), green(@color), blue(@color), @alpha);
}

//默认动画过渡
.transition(@prop: all, @time: 1s, @ease: linear) {
	-webkit-transition: @prop @time @ease;
	-moz-transition: @prop @time @ease;
	-o-transition: @prop @time @ease;
	-ms-transition: @prop @time @ease;
	transition: @prop @time @ease;
}

//小三角up
.triangle-up(@color:#fff,@width:5px){
	width: 0;
    height: 0;
    border-left: @width solid transparent;
    border-right: @width solid transparent;
    border-bottom: @width solid @color;
    border-top:none;
}

//小三角down
.triangle-down(@color:#fff,@width:5px){
	width: 0;
    height: 0;
    border-left: @width solid transparent;
    border-right: @width solid transparent;
    border-top: @width solid @color;
    border-bottom: none;
}

//透明度
.opacity(@value: 0) {
 @ie6_value: (@value * 100);

 -khtml-opacity: @value;
 -moz-opacity: @value;
 opacity: @value;

 filter: ~'alpha(opacity=@{ie6_value})';
}

//线性渐变
.gradient (@origin: top, @start: #ffffff, @stop: #000000) {
    background-color: @start;
    background-image: -webkit-linear-gradient(@origin, @start, @stop);
    background-image: -moz-linear-gradient(@origin, @start, @stop);
    background-image: -o-linear-gradient(@origin, @start, @stop);
    background-image: -ms-linear-gradient(@origin, @start, @stop);
    background-image: linear-gradient(@origin, @start, @stop);
    filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr='@{start}', endColorstr='@{stop}', GradientType='0')";
}



// 重置浏览器对象默认属性
body,ol,ul,li,dl,dd,dt,p,h1,h2,h3,h4,h5{ margin: 0px;padding: 0px; list-style: none;}
a,a:hover{text-decoration: none;}
//自定义webfont
body{background-color:@backgroundColor; font-family:"PingHei", "PingFang SC","\5FAE\8F6F\96C5\9ED1","Helvetica","Arial",sans-serif; font-size: 14px;}
.panel-default{
	min-height: 150px;
	&.panel {
		border:none;
		&.chart-panel {
			.border-radius();
			background-color:@panelBgColor;
			padding: 0px 18px;
			.box-shadowcolor(0px, 1px, @blur: 5px, @shadowColor, .35);
			.ipt-txt{line-height: 34px;height: 34px;}
		}
	}
	&>.panel-heading{
		background-color: #fff;
		letter-spacing: 1px;
	}
}

.left{float: left;}
.right{float: right;}
.anchorBL{ display: none;}
[data-show-rule]{display: none}
input[type="checkbox"]{width: 14px; height: 14px; vertical-align: baseline;}
.default-param-tips{color:#999;font-size:12px; padding-bottom:15px;padding-top:5px}
.advanced-param-btn{color:@mainColor;cursor: pointer;
	&:hover{color:#23527c}
}

//地图标识隐藏
.amap-logo,.amap-copyright{ display: none;}

//重置bootstrap样式
a{color: @mainColor;}
.table .icon{ display: inline-block;width: 20px !important; height: 20px !important; text-align: center; line-height: 20px !important; cursor: pointer;
	&:hover{ .border-radius(20px);background-color: @mainColor;color:#fff }
}
.popover{font-family:'\5FAE\8F6F\96C5\9ED1';line-height: 22px}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{padding:0px 10px}
.col-xs-m2{width:20%; float: left;position: relative;min-height: 1px;}

.modal-content{.border-radius(3px)}
.modal-header{ background-color: @mainColor;color:#fff;padding:10px 15px;
	h4{font-size: 14px;}
	.close{color: #fff;.opacity(1);font-weight: normal;}
	&.register {background-color: #fff;  padding: 15px;
		.close{
			color: #000;
		}
	}
}
.modal-footer{border-top:none; }

.btn-default{padding:6px 14px;}
.btn.btn-danger {
  background-color: #FF1B15;
  border-color: #FF1B15;
  padding:6px 14px;
}
.btn-macc{background-color: @mainColor; border:1px solid @mainColor; color:#fff;padding:6px 14px; color:#fff;outline: none;
	&:hover{
		background-color: darken(@mainColor, 10%);
		border-color: darken(@mainColor, 10%);
		color:#fff	}
	&:active,&:visited,&:focus{color:#fff;outline: none;}
}

.btn-macc.disabled, .btn-macc.disabled.active, .btn-macc.disabled.focus, .btn-macc.disabled:active, .btn-macc.disabled:focus, .btn-macc.disabled:hover, .btn-macc[disabled], .btn-macc[disabled].active, .btn-macc[disabled].focus, .btn-macc[disabled]:active, .btn-macc[disabled]:focus, .btn-macc[disabled]:hover, fieldset[disabled] .btn-macc, fieldset[disabled] .btn-macc.active, fieldset[disabled] .btn-macc.focus, fieldset[disabled] .btn-macc:active, fieldset[disabled] .btn-macc:focus, fieldset[disabled] .btn-macc:hover,.btn-macc.active{
		background-color: darken(@mainColor, 10%);
		border-color: darken(@mainColor, 10%);
		color:#fff;
}

.btns-switch{
	/*border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);*/
	border-radius: 4px;
	overflow: hidden;
	margin-right: 12px;
}
.btn-radio{padding:0px 12px; height: 30px; line-height: 28px; color: #333;
  background-color: #f0f0f0;
  /*background-image: -moz-linear-gradient(top, #e6e6e6, #ffffff);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#e6e6e6), to(#ffffff));
  background-image: -webkit-linear-gradient(top, #e6e6e6, #ffffff);
  background-image: -o-linear-gradient(top, #e6e6e6, #ffffff);
  background-image: linear-gradient(to bottom, #e6e6e6, #ffffff);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe6e6e6', endColorstr='#ffffffff', GradientType=0);
  border-color: #ffffff #ffffff #d9d9d9;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #ffffff;*/
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-color: #fff;
  border-color: #ccc;
  &:hover{color:#333}
}

.btn-radio.active{
	background-color: @mainColor;  color:#fff; border-color: @mainColor;.box-no-shadow();
}

.tooltip-inner{white-space:nowrap;padding:6px 8px}
.group-dialog {
	.modal-dialog{ width: 400px}
}
.panel{position: relative;}
.panel-layout{padding:15px;}
.full-panel{position: fixed;left: 20px; top: 20px;right: 20px;bottom: 0px; height: auto !important; z-index:999}
.panel-action{
	i{cursor: pointer; width: 24px; height: 24px; vertical-align: middle; line-height: 24px; text-align: center;display: inline-block; font-weight: normal;color:#666;
		&:hover{ background-color: @mainColor;color:#fff; .border-radius(24px); }
	}
}
.panel-heading>div{ height: 30px; line-height: 30px;color: @headFontColor;
	.icon-download {
		font-weight: normal;
	    cursor: pointer;
	    margin-left: 10px;
	    color: #1d3650;
	    &:hover {
	    	 color: #4d9dff;
	    }
	}
}
.table>tbody>tr.active>td, .table>tbody>tr>td.active{
	background-color:#d8ecff;
}
.rui-calendar-condensed{
	border-collapse:inherit;
	td{
		vertical-align: middle;
	}
}

.ui-jqgrid a{text-decoration: underline;}



.other-login{
	&>div{font-size: 40px;cursor: pointer; display: inline-block;
		&.bind{cursor: default;
			.icon-weixin{color:#3eb94e}
		}
	}
	.icon{color:#999;}
	.binName{ font-size:16px;}

}

//mifi 暂无数据
.no-data {background-image: url(../images/no-data/no-data.gif);background-repeat: no-repeat;background-position: center;position: relative;
	*{visibility: hidden;}
 //  &:after{content:'暂无数据...';position: absolute;top: 50%;left: 50%;margin-left: -29px;margin-top: 30px;
	// color: #aaa;
 //  }
}



//通用样式
.relative{position: relative;}
.f-primary{color:@greenColor}
.f-normal{color:#f6d917}
.f-warning{color:#f57106}
.f-danger{color:#ee2e02}
.f-success{color:#70ba4f}
.b-primary{background-color:@greenColor}
.b-warning{background-color:#f57106}
.b-danger{background-color:#ee2e02}
.b-success{background-color:#70ba4f}
.b-on{background-color: #70ba4f !important;}
.dot{display: inline-block;vertical-align: middle; .border-radius(15px);width: 8px; height: 8px;}
.ipt-txt{ height: 30px;line-height: 30px; border:1px solid @borderColor; .border-radius(3px); padding: 0px 4px;vertical-align: middle;color:#333;font-size: 14px;
	&:focus{
		border-color:@mainColor;
		.box-shadowcolor();
	}
}
.ipt-select{ height: 30px;line-height: 30px; border:1px solid @borderColor; .border-radius(3px); padding: 0px 4px;vertical-align: middle;
	&:focus{

		border:1px solid @mainColor;
		.box-shadowcolor();
	}
}

// 布局样式
.warp{ .min-width; padding: 0px 15px;}
.head{

	background-color:@headBgColor;
	height:@headHeight;
	.box-shadowcolor(0px, 1px, @blur: 5px, @shadowColor, .35);
	.min-width;
	.warp{position:relative;}
	.useraction{
		.dropdown-menu{right:-30px;left: inherit;}
	}
}
.content {

}
.logo {
	// background: url(../images/login/logo-en-2.svg) no-repeat left center;
	background-size: 85%;
  	width: 180px;
  	height: 80px;
  	float: left;
}

/* 首页菜单 */
.mainmenu{
	line-height: @headHeight;
	margin-left: 26px;
	float: left;

	>ul>li{
		text-align: center;
		float: left;
		cursor:pointer;
		position: relative;
		>a{
			color:@headFontColor;
			display: block;
			font-size: 18px;
  			line-height: 20px;
  			padding: 30px 20px;
  			&:hover{
  				border-top: 3px solid @mainColor;
				padding-top: 27px;
			}

		}

		.icon {
			display: inline-block;
  			margin-top: -5px;
  			vertical-align: middle;
		}
		&:hover{
			>a{ color:@mainColor; }
			.sub-menu-ol {
				display: block;
			}
		}
		&.selected {
			>a{
				color:@mainColor;
			}
		}
	}
}

.head-right{
	float: right;
	height: 36px;
	line-height: 36px;
	li{
		float: left;
		color:@headFontColor;
		cursor: pointer;
		font-size:12px;
		padding:0px 20px;
		margin-top: 13px;
		&.message{
			border-right: 1px solid #1b222c;
			span {
				width:18px;
				height: 18px;
				background-color: #212934;
				display: inline-block;
				text-align: center;
				line-height: 18px;
				margin-left: 5px;
				.border-radius(4px);
			}
			&:hover{
				color:@mainColor;
			}
		}
		&.useraction{
			b{
				display: inline-block;
				vertical-align: middle;
				margin-left: 3px;
				.triangle-down(@headFontColor,4px);
			}
			&:hover{
				color:@mainColor;
				b{
					.triangle-up(@mainColor,4px);
				}
			}
		}
	}

}

.foot{
	text-align: center;
	height: 50px;
	line-height: 50px;
	color:#999999;
	background-color: #fff;
	font-size: 12px;
	.hr-line{
		border-top:1px solid @borderColor;
	}
}

.total{ margin:20px 0px}
@totalColor1:#1e97f7;
@totalColor2:@greenColor;
@totalColor3:#f9a605;
@totalColor4:#ee2e02;

.total-color(@color:@totalColor1){
	.icon-border{
			border-color:@color;
			color:@color;
		}
		.total-info{
			color:@color;
		}
}
.total-span{
	height: 138px;
	border-right:1px solid @borderColor;
	background-color: #fff;
	text-align: center;
	&.index>div {
		margin-top: 35px;
	}
	&>div{
		display: inline-block;
		vertical-align: middle;
		margin-top: 12px;
		&.icon-border{
			width: 62px;
			height: 62px;
			border-width: 2px;
			border-style: solid;
			line-height: 62px;
			font-size: 32px;
			margin-right: 20px;
			.border-radius(62px);
		}
		&.total-info{
			text-align: left;
			span{
				font-size: 36px;
				line-height: 1.2;
			}
			div{
				font-size: 14px;
				color:#666;
			}
		}
	}
	&.color-network{
		.total-color(@totalColor1);
	}
	&.color-ap{
		.total-color(@totalColor2);
	}
	&.color-device{
		.total-color(@totalColor3);
	}
	&.color-alarm{
		.total-color(@totalColor4);
	}
}
.working{
    // background-image: url(../images/work/work.gif);
    background-repeat: no-repeat;background-position: center;font-size:0;
	&.inline{background-position: left center;background-size:100%;}
	*{ display: none}
}

.allaptable{position: absolute;  z-index: 999; left: 1px; right: 0;top:0;bottom: 0; background-color: #fff;padding:8px;}

.alarm-info{margin-left:15px; text-align: left;	}

.plan-content{margin-top: 20px;padding:0px 10px;
	li[class*="col-xs-"]{padding:0px 10px;}
}

.plan-content {
	.search {
		position:relative;
		#searchAddress{
			width:400px;
			height: 30px;
			// line-height: 30px;
			// text-indent: 10px;
			// border:1px solid #dadee5;
			// border-radius:3px;
		}
	}
}

#tree { padding: 0px}
.group-tree {
	.tree-name {float: left; cursor: pointer;
			i{margin-right: 5px; color:#666; margin-right: 5px;
				&.expand-btn{ margin-right: 8px;}
			}
		}
	.add-group{ width: auto;}

	}
.tree-root{height: 43px;line-height: 43px; background-color: @mainColor; color: #fff; font-size: 14px;position: relative;display: flex;
    justify-content: space-between;
	.border-radius();
	.tree-name{text-indent: 12px;flex: 1;overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
	.action{
		text-align: right;
		i.icon:hover{color:@mainColor; .border-radius(30px); background-color: #fff; }

	}
	.seach-tree{ position: absolute; height: 100%; left: 0px; right: 0px;background-color: #fff;
		 border:1px solid @mainColor;display: none;z-index:999;
		.ipt-txt-seach{  width: 100%; height: 30px;  vertical-align: middle; padding-left:10px; padding-right: 36px;color:#333; line-height: 30px}
		i{color:#999; position: absolute; right: 0px; width: 36px; text-align: center;}
		.seach-seach-content{ background-color: #fff;color: #333; max-height: 350px; overflow: auto;
			.treeSeach-Results-item{ padding:0px 8px;white-space:nowrap; line-height: 30px;cursor: pointer;
				i{position:static; margin-right: 10px}
				.group-nave{ margin-left: 10px; color: #999;}
				&:hover{ background-color:rgba(red(@mainColor),green(@mainColor),blue(@mainColor),1);
					color:#fff;
					.icon,.group-nave{color:#fefefe}
				}
			}
		}
	}
}
.tree-body{
	background-color: #fff;
	overflow: auto;
	color: @subTitleColor;
	width: 100%;
}

.action{float: right; width: 120px;margin-right: 7px;
		i{width: 24px; height: 24px; display: inline-block; text-align: center; line-height: 22px;margin-left: 2px;cursor: pointer;.border-radius(30px);position: relative;
			.menuList {
				&.w_100 {
					width: 100px;
				}
				width:80px;
				display: none;
				position: absolute;
				top: 102%;
				left:0;
				border-radius: 5px;
				z-index: 1000;
				border: 1px solid rgba(0,0,0,.15);
				background-color: #fff;
				color:#333;
				box-shadow: 0 6px 12px rgba(0,0,0,.175);
				& li{
					padding: 5px 10px;
					&:hover{
						background: #f5f5f5;
					}
				}
				&.on{
					display: block;
				}
				li{
					height: 40px;
					line-height: 40px;
				}
			}
		}
		}
.tree-line{border-bottom:1px solid @borderColor; clear: both; line-height: 36px;  position: relative;
	&:after {
		content: "" ;
		display: block ;
		height: 0 ;
		clear: both ;
		visibility: hidden ;
	}
	.tree-name{
			span{word-wrap: break-word; word-break: normal;display: inline-block;text-indent: 0;vertical-align: top;}
			.icon{vertical-align: top}
		}
	&.selected{
		background-color: #f0f7ff;
		color: #5da4ff;
	}
	&:hover{
		.tree-name{
			color:@mainColor;
			i.icon{ color:#5da4ff;
				&.expand-btn{color:#666}
			}
		}
	}
	.action{
		text-align: right;position: absolute; right: 0px;top:0px;
		i.icon{ color:#666;}
		i.icon:hover{color:#fff;  background-color: @mainColor; }
	}
}



.add-group{ margin: 15px; border-style: dashed; border-width: 1px; border-color: @borderColor; line-height: 40px; padding: 0px 15px;color: #999; cursor: pointer; display: block;
	&:link{text-decoration: none; color:#999 }
	&:hover{color:@mainColor; border-color:@mainColor;}
}
.group-content{
	dl{
		clear: both;margin-bottom: 15px;overflow: hidden;
		&:last-child{margin-bottom: 0px;}
		dt,dd{float: left; line-height: 30px;}
		dt{width: 30%; text-align: right;font-weight: normal; }
		dd{width: 70%;
			span{ margin-right: 20px; cursor: pointer;
				i{ margin-right:3px;}
				&.selected{color:@mainColor;}
			}
			&>div{display: inline-block;color:@mainColor; font-size: 16px; cursor: pointer;}
		}
	}
	.ipt-txt,.ipt-select{width:200px;}
	.groupType-disabled{pointer-events: none;}

}

.hidden {display:none!important}
.zoom1{padding:0px; height: 100%;zoom:1}


.floorlayout{
	 height: 100%;
	.floorlayout-heading{ height: 56px; line-height: 56px;padding:0px 20px;overflow:hidden;
		span.item{ margin-right: 10px; display:inline-block; vertical-align: middle;}
		.icon,.glyphicon{vertical-align:middle;font-size: 16px;cursor: pointer; display: inline-block; text-align: center;width: 30px; height: 30px;line-height: 30px;color:#666;
		&:hover{.border-radius(30px);background-color: @mainColor;color:#fff}
	}
	}
	.ipt-txt,.btn{}
	.ipt-txt{ height: 34px; line-height: 34px; vertical-align:middle; width: 109px;.border-radius;  padding: 0px 5px}
	select.ipt-txt{width: 130px; margin-right: 0px;color:#999}

	.floorlayout-body{ position: relative; left: 0; right: 0; bottom: 0;top:56px;padding:10px;}
	.floorlayout-map{position: absolute; left: 0; right: 0; bottom: 0;top:0;padding:10px;}
	.freedevs-panel{
		position: absolute;left: auto;right: 10px;bottom: 0;top: 56px; width:240px;
		h4{ height: 40px;line-height: 40px;
			.title{font-weight: bold;}
			.action{ width: auto;}
			.icon{width: 30px; height: 30px; display: inline-block; line-height: 30px;.border-radius(30px);
				&:hover{color:@mainColor;}
			}
		}
	}
	.freeDevs{position: absolute;left: 0;right: 0;bottom: 10px;top: 40px;overflow: auto;
		li{ line-height: 30px; margin-bottom: 5px;
			&:last-child{margin-bottom: 0px;}
		}
		.freedev{ width: 100%; border:1px solid @borderColor; padding: 0px 10px; background-color:#f5f5f5;cursor: move; .border-radius(3px);
			&:hover{border:1px dashed @mainColor; background-color: #d8ecff}
		}
	}
}

.maptab{
	text-align: center;margin-top:15px;
	li{ display: inline-block;
		&.selected{
			.span-box{
				background-color: @mainColor; color: #fff;
			}

		}
	}
	.span-box{ width: 96px; height: 96px; background-color: #f8f9fb; border-style: dashed; border-width: 1px; border-color: @borderColor; margin: 0px 10px;cursor: pointer;
		i{font-size: 36px;line-height: 60px;}

	}
}

.webuploader-pick{ width: 168px; height: 44px;position: relative; left: 0px; top:0px;}

.map{ height: 100%; overflow: hidden;}
.device-info{margin-bottom: 12px;
	.ipt-txt{width: 100px;margin-right: 12px;}
		i.icon{width: 24px; height: 24px; line-height: 22px;display: inline-block; text-align: center; vertical-align: middle; margin-left: 2px}
		span.span-add:hover{
			cursor: pointer;
			i.icon{background-color: @mainColor; .border-radius(24px);color: #fff;}
		}
		span.span-show{
			label{ margin-right: 12px}
			i.icon:hover{background-color: @mainColor; .border-radius(24px);color: #fff; cursor: pointer;}
		}
		label{vertical-align: middle; display: inline-block; height: 24px; line-height: 24px;}
}
.mappage{ height: 100%;position: relative;
	&.on{display: block;}
	&.out{display: none;}
	.addlocation{ width: 380px; height:250px ; position: absolute; left: 50%; top:50%; margin-left:-190px ;margin-top:-125px; border-style: solid; border-width: 1px; border-color: @borderColor; text-align: center; background-color:#f8f9fb; cursor: pointer;
		i.icon,p{color:#666}
		i.icon{ font-size: 72px; line-height: 200px}
		p{ font-size: 16px; margin-top:-45px}
		&:hover{
			background-color: #edf6ff;
			i.icon,p{color:@mainColor}
		}
	}
	.maplayout{ padding: 10px 20px; height: 100%; overflow: auto;
		.device-info,.map-location{ margin-bottom: 12px;}
		.ipt-seach,.ipt-txt{
			 height: 34px;line-height: 34px;.border-radius(3px);vertical-align:middle;padding:0px 5px;
		}
		.ipt-seach{  width: 200px;  margin-right: 12px;border:1px solid @borderColor;}
		.ipt-txt{width: 100px;margin-right: 12px;}
		i.icon{width: 24px; height: 24px; line-height: 22px;display: inline-block; text-align: center; vertical-align: middle; margin-left: 2px}
		span.span-add:hover{
			cursor: pointer;
			i.icon{background-color: @mainColor; .border-radius(24px);color: #fff;}
		}
		span.span-show{
			label{ margin-right: 12px}
			i.icon:hover{background-color: @mainColor; .border-radius(24px);color: #fff; cursor: pointer;}
		}
		label{vertical-align: middle; display: inline-block; height: 24px; line-height: 24px;}
	}

}

.img-library{padding-top:15px; border-style: solid; border-width: 1px; border-color: @borderColor; margin-top: 15px;
		.imglib-seach{
			&>span{ position: relative; vertical-align: middle; line-height: 34px; display: inline-block;margin-right: 10px;margin-left:10px;
				.icon{position: absolute; top:0px; left: 8px; }
				.ipt-txt{ height: 34px; line-height: 34px;padding-left:32px;  .border-radius(3px);}
			}
		}
		.imglib-list{ text-align: center; padding: 0px 15px; height: 280px; overflow: auto;
			li{ padding-top:10px; padding-bottom: 15px;
				&.selected,&:hover{
					.img-span{
						border-color:@mainColor;
						.box-shadow();
						a{display: block; width: 94px; }
					}
				}
			}
			.img-span{ display: inline-block; width: 94px; height: 108px; font-size: 12px; border-style: solid; border-width: 1px; border-color: #fff; padding-top: 8px;position: relative;
				a{ display: none; position: absolute; bottom: -22px; font-size: 12px; color: @mainColor;}
			}

		}
	}


//消息框及弹出对话框
.myalert{
	.modal-header{ }
	.modal-dialog{ margin-top: 200px}
	.modal-body{ display: table;
		p{display: table-cell;vertical-align:middle;word-wrap: break-word; word-break: normal;
			i{ font-size: 32px; color: #d9534f;  margin-right: 10px;
				&.glyphicon-primary{
					color: @mainColor;
					&:before{content: "\e086"}
				}
				&.glyphicon-success{
					color: #5cb85c;
					&:before{content: "\e084"}
				}
				&.glyphicon-warning{
					color: #f0ad4e;
					&:before{content: "\e107"}
				}
				&.glyphicon-danger{
					color: #ff1B15;
					&:before{content: "\e101"}
				}
			}
		}

		select.ipt-txt {
			max-width: 230px;
		}
	}

	.modal-footer {
		.btn-primary {
			background: @mainColor;
			border-color: @mainColor;
			padding: 6px 14px;
		}
	}
}
.dialog-message-list{position: fixed; top:65px; width: 300px;right:10px;z-index: 2000;
	.alert{word-wrap: break-word; word-break: normal;}
}

.confingmenu{background-color: #fff; padding: 13px 0px;.box-shadow(0px,1px,5px,0.2);.min-width(); text-align: left;
	span{border-left: 1px solid #aaabac; display: inline-block; padding:0px 30px;
		&:last-child{border-right: 1px solid #aaabac;}
		&.selected{
			a{color:@mainColor}
		}
		a{ color: #333;
			&:hover{color:@mainColor}
		}
	}
 }
 .config-static{ margin: 100px 0px; text-align: center;}
 #configPanel{
 	.panel-body{position: absolute; top:45px; left: 0px; right: 0px; bottom: 0px; overflow: auto;}
 }
 .config-content{height: 100%;
	ul,li{height:100%}
	&>ul>li{
		&:first-child{border-right: 1px solid @borderColor;}
	}
	h5{font-weight: bold;}
	span.blue{color:@mainColor;}
	b.blue{color:@mainColor; background-color: @mainColor;}
	b.green{color:#bbc34a; background-color: #bbc34a;}
	b.yellow{color:#ffbf00; background-color: #ffbf00;}
	.config-menu{
		padding:0px 16px;
		&>ul>li{ height: 30px; line-height: 30px; margin-top: 20px; text-indent: 20px;
			a{color:#333;
				b{ width: 12px; height: 12px; display: inline-block; margin-right: 12px;.border-radius(12px) }
			}
			&.selected{background-color: #d8ecff;
				a{color:@mainColor;}
			}
		}
	}
	.apgroup-content{ padding: 0px 16px;
		.icon{font-weight: normal;}
	}
	#J_config{ height: 100%;overflow-y: auto; overflow-x: hidden;}
	.apgroup-content-body{ padding-top: 15px;}


 }
.span-panel{
	h4{ line-height: 2}
	.span-panel-body{padding: 0px 5px;
		li{ height: 130px; margin:10px 0px;
			&[class*='col-xs']{ padding: 0px 10px}
		}
	.table-action{
		span{cursor: pointer;
			&:hover{color:@mainColor}
	}
	}
	}
}
.tplpanel{ height: 100%; width: 100%; border:1px solid @borderColor;background-color: #f8f9fb;position: relative;
	&:hover{border-color:@mainColor}
	.addpanel{
		text-align: center;padding-top:23px; height: 100%;cursor: pointer;
		i.icon-addadress{ font-size: 32px; line-height: 60px; }
		&:hover{ color:@mainColor;}
	}
	h3{ height: 35px; line-height: 35px; background-color: #e5e9f0; color: #666; padding: 0px 12px;position:absolute;top:0;left: 0;right:0;
		i.icon{cursor: pointer; margin-left: 5px;
			&:hover{color:@mainColor;}
		}
		.pull-left{max-width: 40%; text-overflow:ellipsis;white-space:nowrap; overflow: hidden;
			&:hover{ position: absolute; left: 12px;  text-overflow:inherit;overflow:visible; color:@mainColor}
		}

	}
	.tplpanel-body{padding: 10px 12px; line-height: 1.8; font-size: 12px; height: 100%; padding-top:35px;
		p.inner{ margin-top: 10px;}
	}
}
.selected{
	&>.tplpanel{
		border-color:@mainColor;background-color: #d8ecff;
		h3{background-color: @mainColor; color: #fff;
			.pull-left,.pull-right .icon{
				&:hover{color:#fff}
			}
		}
	}
}
.tpl-content{ height: 100%;position: relative; margin: 0px 16px;
	.tpl-list{
		position: absolute; top:45px; bottom: 55px; left: 0px; right: 0px;margin-top: 0px;
		.span-panel-body{position: absolute;top:32px; left: 0px; right:0px; bottom: 0px; overflow-y: auto;overflow-x: hidden;}

	}
	.tpl-foot{position: absolute; bottom: 0px; left: 0px;right: 0px; height: 55px; background-color: #e5e9f0; line-height: 55px;
		.btn{vertical-align:middle; margin-right: 10px;}
	}
}
.tpl-list-type,.show-type{
	li{ float: left; vertical-align: middle; margin-right: 12px;
		&.selected{
			i.icon{background-color: @mainColor;color: #fff}
		}
	}
	i.icon{display: inline-block;width: 32px; height: 32px; background-color: #e5e9f0; line-height: 32px; text-align: center;cursor: pointer;.border-radius; font-size: 16px}
}
.show-type{display: inline-block;}
.step{
	li.selected,li.selected a{
		background-image: url(../images/step.png); background-repeat: no-repeat;
	}
	li{ height: 32px; line-height: 32px; padding-right:15px; padding-left: 30px; background-color: #e5e9f0; float: left; box-sizing:content-box;position: relative;z-index: 1;
		a{ position: relative;  display: inline-block; height: 100%; z-index:11;  text-align: center; color:#333 }
		&:first-child{

		}

		&:first-child{
			&.selected{
				background-image: none;
				a{background-position: right 0px; }
			}
		}
		&:last-child{
			&.selected{
				a{
					background-position: right -80px;
				}
			}
		}
		&.selected{
			background-color: @mainColor;color:#fff; background-position: left -160px;
			a{color:#fff;padding-right:30px; margin-right:-15px;}
		}

	}
}

.apdevice-content{padding:0px 14px;
	.seach-content{
		span{position: relative; display: inline-block;vertical-align: middle;margin-right: 10px;
			i.icon-seach{position: absolute; left: 12px;top:4px;color:#9c9c9c}
		}
	}
	.ipt-txt{ height: 32px; line-height: 32px;.border-radius;}
	.seach{padding-left: 32px; padding-right: 12px; width: 400px}
	.btn{vertical-align: middle; height: 32px; padding: 4px 12px;}
}

.apexport-content{ padding:0px 14px;
	.apexport-dev{ line-height: 1.8;
		span{ margin-right: 15px;}
	}
	.span-box{ margin-top: 15px;
		.dns-switch,.table-list{ margin-top: 15px;}
		.dns-switch{
			span.check{ margin-left: 20px;}
		}
		.table-list{
			.table-tools{
				i.icon{ margin-right: 12px;cursor: pointer; width: 24px; height: 24px;.border-radius(24px); text-align: center; display: inline-block;
					&:hover{
						background-color: @mainColor; color:#fff;
					}
				}
			}
		}
	}
}
.span-box{
	h3{ border-bottom: 1px solid @borderColor; font-weight: bold; line-height: 32px;}
}

.switchBtn{display: inline-block; width: 50px; height: 30px; overflow: hidden;.border-radius(30px);.gradient(top,#fff,#ededed); border:1px solid @borderColor; vertical-align: middle;position: relative;cursor: pointer;
	&>div{
		position: relative;width: 75px; height: 24px; left: -25px;.transition(all,.2s,linear); margin-top:2px;display: table;
		span{ display: table-cell;width: 25px; height: 100%; text-align: center; vertical-align: middle; line-height: 100%;
			&.l{color:#fff}
			&.m{
				b{display:inline-block;width:24px; height:24px;.gradient(top,#fff,#ededed); border:1px solid @borderColor;.border-radius(25px);}
			}
			&.r{
				b{border:1px solid #666; display: inline-block;.border-radius(10px); width: 10px; height: 10px;}
			}
		}
	}
	&.on{background-color: @mainColor;background-image: none;border-color: #1684dc;
		&>div{left: 0px;
				span{
					&.m{border-color: #1684dc;}
				}
		}
	}
}
.template-layout{position: relative;
	.tpllist-content{position: absolute; left: 0; right: 0; bottom: 0;top:20px; overflow: auto; padding:0px 15px;}
	.tpl-list-type{ margin-bottom: 15px}
	.span-panel{
		h4{ font-weight: bold;}
	}
	.inline-table{ padding:10px; margin-bottom:0px;background-color: #f5f6f9;border:1px solid @borderColor;
		h3{ line-height: 24px;border-bottom:1px solid @borderColor; padding-bottom: 5px;}
		table{background-color: #fff;}
	}
}
.location-layout{padding: 10px 20px;position: relative;height: 100%;
	.location-total{ height: 32px; line-height: 32px; margin-left: 8px;
		i.icon{ font-size: 18px; vertical-align: baseline;margin-right: 5px}
		&>span{margin-right: 20px}
	}
	.location-body{
		position: absolute; left: 20px;right: 20px; bottom: 10px; top:52px; overflow: hidden;
		&>ul,li.location-page,.mapcontent{ height: 100%;}
	}
}

.building-layout{padding:10px;height: 100%; position: relative;overflow-y:auto;overflow-x:hidden;
	.building-nave-tab{
		border-bottom: 1px solid @borderColor; line-height: 40px;position: relative;font-size:16px;
		li{float: left; min-width: 80px; text-align: center;cursor: pointer; line-height: 44px;color: @headFontColor;padding:0px 12px;
			&.selected{border-bottom: 3px solid @mainColor;}
			a {color: @headFontColor;}
		}
		.selectedbar{position: absolute; width: 80px;height: 3px; background-color: @mainColor;bottom: -1px;.transition(all,0.2s,linear);font-size: 0px;line-height: 0px;.border-radius();display: none}
		.tab-tools{position: absolute;right: 0px;top: 0px; cursor: pointer;
			&:hover{color:@mainColor}
			&>i {
				margin-right: 3px;
			}
		}
		&.small{
			font-size: 14px;
			li{
				line-height: 30px;
			}
		}
	}
	.building-tab-content{
		position: absolute;top:48px;bottom: 10px; left: 0px; right: 0px; overflow: auto; padding-right: 20px;
		i.icon-help,i.icon-export{font-weight: normal;cursor: pointer; margin-left: 10px;color: @headFontColor;
				&:hover{color: @mainColor;}
		}
	}
	.building-total{
		#menuMore {
			&:hover {
				background: #1a81ff;
				border-radius: 5px;
			}
			display: inline-block;
			margin-left: 10px;
			.dLabel{
				background: #4d9dff;
				border: none;
				color: white;
				border-radius: 5px;
			}
			.dropdown-menu {
				li {
					padding: 0 10px;
				}
			}
		}
		padding:20px 10px;
		&.count-total {
			.border-radius();
			background-color: @panelBgColor;
			margin-top: 20px;
			.box-shadowcolor(0px, 1px, @blur: 5px, @shadowColor, .35);
			&.mtfi {
				margin-top: -10px;
			}
		}
		li[class*='col-xs']{
			 &:last-of-type {
			 	.total-span {
			 		border: none;
			 	}
			 }
		}
		.info-typeicon{ width: 66px; height: 66px; .border-radius(66px); line-height: 66px; margin-right: 20px;
			.icon{color:#fff; font-size: 24px}
		}
		.total-info{
			p{	font-size: 14px;color:#999;
				&.item{color:@subTitleColor;}
				&.total{margin:0px}
				&>span{font-size: 32px}
				}
			em{font-size: 14px;color:@subTitleColor;}
		}
		.ap-theme{
			.info-typeicon{background-color: @greenColor}
			.total-info{
				span.info{color:@greenColor}
				}
		}
		.user-theme{
			.info-typeicon{background-color: #4dd089}
			.total-info{
				span.info{color:#4dd089}
				}
		}

		.total-span{
			height: 88px;position: relative;
			.total-tips{
				position: absolute;left: 0px;right: 0px; bottom: 0px; overflow: hidden;background-color: #f8f9fb;border-top: 1px solid @borderColor;
				li{  overflow: hidden; clear: both; padding:0px 15px;  line-height: 32px;}
			}
			b{ width: 10px; height: 10px; .border-radius(10px); display: inline-block; vertical-align: middle; margin-right: 8px;
				&.c1{background-color: @circle1;}
				&.c2{background-color: @circle2;}
				&.c3{background-color: @circle3;}
				&.c4{background-color: @circle4;}
			}
		}
		.alarm-theme{
			.info-typeicon{background-color: #ee2e02}
			.total-info{
				span.info{color:#ee2e02}
				}
			.total-tips{
				li{ clear: none !important; height: 64px; line-height: 24px; padding-top: 10px;
					i{ font-size: 16px;}
				}
			}
		}
	}

}

.table-panel{box-shadow: none;-webkit-box-shadow:none;
		&.full-panel{.box-shadow(0px,1px,3px,0.3); padding:15px 20px;overflow: auto}
		h3{
			.title{font-weight: bold;}
			margin-bottom: 10px;
		}
		.panel-action{
			span{position: relative;
				div{position: absolute;border:1px solid @borderColor;right: 10px;top:26px; padding: 10px 12px;.border-radius;.box-shadow(0px,3px,5px,.3);background-color: #fff;z-index: 999;
					&.off{display: none}
					li{white-space:nowrap; line-height: 24px;
						input,label{vertical-align: middle;}
						input{margin-right:5px;}
					}
				}
			}
		}
		.table-action{  line-height: 30px;margin-bottom: 10px;
			.ipt-txt {height: 34px; line-height: 34px;}
			.btn{ padding: 0px 12px;line-height: 32px;}
			&>div>span{
				vertical-align: middle; margin-right: 10px;display: inline-block;
				>i {
					margin-right: 3px;
				}
			}
			.pull-left{
				span{ cursor: pointer;
					&.disabled{
						color:#ccc;
						&:hover{
							color:#ccc;
						}
					}
					&:hover{color:@mainColor}
				}
			}
		}
		.add-equip{
			.nave-tab{
				border-bottom: 1px solid #dadee5;
		    line-height: 40px;
		    position: relative;
			}
			.nave-tab-content>ul>li{
				display: none;
				&.current {
					display: block;
				}
				min-height: 60px;
				.panel-content {
					background-color: #fff;
					border: 1px solid transparent;
					border-radius: 4px;
					margin: 20px 0;
					.J_device_addBtn {
						&.disabled {
							background-color: #ccc;
							border-color: #ccc;
							cursor:not-allowed;
						}
					}
				}
			}
		}
		.equip-list{
			.nave-tab{
				border-bottom: 1px solid #dadee5;
		    line-height: 40px;
		    position: relative;
			}
			.nave-tab-content>ul>li{
				display: none;
				&.current {
					display: block;
				}
				min-height: 60px;
				.panel-content {
					background-color: #fff;
					border: 1px solid transparent;
					border-radius: 4px;
					margin: 20px 0;
					// .J_device_addBtn {
					// 	&.disabled {
					// 		background-color: #ccc;
					// 		border-color: #ccc;
					// 		cursor:not-allowed;
					// 	}
					// }
				}
			}
		}
	}



/* 头部下拉框 */
.header-menu-btn {
  background-color: #fff;
  color: @mainColor;
}
.btn.header-menu-btn:focus {
  color: @mainColor;
}
.btn.header-menu-btn:hover {
  color: @mainColor;
}
.btn.header-menu-btn:focus .caret{
  border-top: none;
  border-bottom: 4px dashed;
}
.btn.header-menu-btn:hover .caret{
  border-top: none;
  border-bottom: 4px dashed;
}
.dropdown-menu.header-menu {
	border: none;
	top: 65px;
   .box-shadowcolor(0px, 1px, @blur: 5px, @shadowColor, .35);
}
.dropdown-menu.header-menu>li>a:hover{
  color: @mainColor;
}

/*配置模板*/
.tplconfig-menu{
	margin:0px 10px;
	h3{font-weight: bolder;}
	ul{
		li{ height: 30px; line-height: 30px; padding:0px 10px;margin-top: 20px;
			a{color:#666;}
			i.dot{ .border-radius(99px); width: 12px; height: 12px; display: inline-block;margin-right: 12px }
			i.color1{background-color: #03a9f4}
			i.color2{background-color: #bbc34a}
			i.color3{background-color: #ffbf00}
			i.color4{background-color: #ff5722}
			&.selected,&:hover{
				background-color: #d8ecff;
				a{color:@mainColor;}
			}
		}

	}
}

.tplconfig-layout,.config-body{ height: 100%; }
.config-body{ border-left: 1px solid @borderColor; overflow: auto;
	.span-block{ margin: 0px 10px;margin-bottom: 20px;}
}
.span-block{
	.icon{cursor: pointer;font-size: 14px; width: 24px; height: 24px;display: inline-block; line-height: 24px;text-align: center;.border-radius(24px);color:#666;
			&:hover,&.open{background-color: @mainColor; color:#fff;}
		}
	.icon-help{
		&:hover{background-color: transparent;color: @mainColor;}
	}
	h4{border-bottom: 1px solid @borderColor;padding-bottom: 11px;padding-right: 20px;position: relative;
		span{font-weight: bolder; display: block; cursor: pointer;}
		.icon{color:#999;position: absolute;right:0px; top:0px}
	}
	.span-block-body{ padding-top: 10px;}
}


.radio-panel-list{
	.row{ margin-left: -10px; margin-right: -10px;}
	li[class*="col-xs-"]{ padding:0px 10px; margin-top: 10px}
}
.radio-panel{
	.border-radius(3px);border:1px solid @borderColor;
	.icon-save:after{content: "保存修改并下发->";position: absolute; right: 25px;white-space:nowrap;}
	h5{ height: 35px; line-height: 35px; background-color: #e5e9f0;  padding-left: 13px;
		.radio-action{ margin-right: 5px;}
		.icon-edit{display: inline-block}
		.icon-save{display: none; position: relative;}
	}
	.radio-body{ padding: 0px 20px; overflow: hidden;background-color: #f8f9fb;padding-bottom: 10px;}
	dl{clear: both; margin-top: 10px;overflow: hidden;
		dt,dd{float: left; height: 32px; line-height: 32px;}
		dt{width: 45%;}
		dd{
			.display{display: block}
			.edit{display: none}
			.ipt-txt{ width: 130px}
		}
	}
	&.edit{
		border-color:@mainColor;
		h5{background-color: @mainColor;color:#fff;
			.icon{color:#fff;
				&:hover{background-color: #fff;color: @mainColor}
			}
			.icon-edit{display: none}
			.icon-save{display: inline-block}
		}
		dl{
			dd{
				.display{display: none}
				.edit{display: block;}
			}
		}
	}
}

.ssid-panel{
	background-color: #f5f6f9; border:1px solid @mainColor; padding:12px 30px 20px;
	.auth-content{padding-left: 150px;}
	.ssid-span{border-top:1px solid #ccc; padding:4px 0px;
		.row{margin-left: 0px; margin-right: 0px;}
		li{padding:0px}

	}
	dl{ clear: both; padding:4px 0px;  line-height: 30px;padding-left: 150px; overflow: hidden;}
	dt{ float: left; height: 100%;}
	dt{width: 150px;margin-left: -150px;}
	dd{height: 100%;
		.ipt-txt{width: 163px;}
		label{ margin-right:12px}
	}
	.param-item{ margin-bottom: 8px;
		span{display: inline-block;
			label{width: 75px; text-align: right;}
			.ipt-txt{width: 250px;}
		}
		[data-show-rule]{display: none}

	}
}
.ssid-panel .ssid-span:first-child{border-top: none}
.ssid-panel-content{margin:10px 0px}

.table-bordered>thead>tr>th,.table-bordered>tbody>tr>td,.table-bordered{border: none;}
.table-bordered>tbody>tr>td{border-bottom: 1px solid #ced3db}
.table>tbody>tr.success>td{background-color: #d8ecff}
.ui-jqgrid .ui-jqgrid-bdiv table.table-bordered tr:last-child td{border-bottom: none;}
.ui-pager-control{background-color: #f5f5f5}
.ssid-table,.macc-potal-table{
	#SSID_jqgrid_subgrid,.subgrid-cell,.ui-sgcollapsed,.jqgfirstrow>td:nth-child(2){width:0px !important;
		*{display: none}
	}
	#J_grestDemo_jqgrid{
		.jqgfirstrow>td:nth-child(2){ width:auto !important;}
		td{border-bottom: 1px solid @borderColor}

	}
}

.ssid-btn-list{ text-align: center;
	input{ margin: 0px 5px !important;}
}

.span-from{
	dd,dt{float: left; line-height: 30px;}
}

#J_plan_layout {
	&>.panel>.panel-body{overflow-x: hidden;overflow-y: auto;}
	.group-tree{
		display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
		.tree-body{
			flex:1;
		}
	}
}
.monitor-devinfo{
	height: 100%;
	.row{height: 100%}
	&>ul>li[class*="col-xs-"]{ height: 100%; padding:0px 20px;
		&:last-child{ border-left: 1px solid @borderColor}
	}
	.dev-param{
		li,h3{border-bottom:1px solid @borderColor; line-height: 40px; padding:0px 18px; overflow: hidden;}
		h3{font-weight: bold;
			em{display: inline-block; width: 10px; height: 10px; background-color: #ccc; .border-radius(16px);vertical-align: middle; margin-right: 5px;
				&.on{background-color: @greenColor}
			 }
			span{vertical-align: middle;}
		}
		dl{ clear:both;padding-left: 80px;
			dt,dd{ float: left;}
			dt{ width: 80px; margin-left: -80px}

		}
		.group{
			h4{font-weight: bold;}

		}
		.hasedit{position: relative;
				.icon-edit{position: absolute; right: 0px}
		}
		.nave{ line-height: 32px;padding-left:18px;
			.icon{cursor: pointer; font-weight: normal;}
			.icon-inlineEdit{color:@mainColor;}
			.icon-inlineOk{color:#60B838;}
			.icon-inlineCanel{color:#ee2e02;}
		}

	}
	.dev-span{ border-top:1px solid  @borderColor; border-bottom: 1px solid @borderColor;height: 110px; padding:22px 0px;margin:20px 0px;
		.icon{margin-right: 5px;}
		&>ul{height: 100%}
		&>ul>li{ border-left: 1px solid @borderColor; height: 100%; text-align: center;
			&:first-child{border-left: none;}
			line-height: 1.8;

			p{ text-align: left; padding-left: 45px; line-height: 26px}
		}
		em{ display: inline-block; width: 10px; height: 10px; vertical-align: middle; margin-right: 8px; .border-radius(10px)}
	}
	.userate-charts{ width: 60px; height: 60px; vertical-align: middle; margin:0px auto;margin-top:-12px}
	.alarm-theme{.border-radius(50%);background-color: #ee2e02; line-height: 60px; font-size: 30px;color:#fff;
		.icon{ margin-right: 0px}
	}
	span{display: inline-block; vertical-align: middle;}

}
.group-location{
	&>span:first-child{font-weight: bold;}
	a{color:@mainColor;}
}

.grid-table{
	.actions{
		.icon{ display: inline-block; width: 20px; height: 20px; line-height: 24px; cursor: pointer;
			&:hover{ .border-radius(20px);color: #fff;background-color: @mainColor; }
		}
	}

}
.devicesupdata-layout{ padding:10px 20px;}
.grid-action{
	span{ margin-left: 10px; position: relative;
		.icon-seach{position: absolute;top:2px; left: 6px;color:#b5b5b5}
	}
	.btn{ height: 30px;  padding: 0px 12px;}
	.ipt-txt{ vertical-align: middle; width: 118px;color:#b5b5b5}
	.seach-box{ padding-left: 25px;}
	a{color:#333; margin-right: 20px; display: inline-block;vertical-align: middle;height: 30px; line-height: 30px;}
}

.map-panel{  position: relative;
	.nolocbuildinglist{ position: absolute; z-index: 999;
		.count{color:@mainColor; cursor: pointer;}
		.nolocbuildingtable{width: 500px; background-color: #fff; margin-top: 10px}
	}
}

.build-panel{
	h3{ font-size: 16px;  font-weight: bold; margin-top: 40px;}
	.build-panel-body{ margin-top: 20px;}
	.item-group{ border-bottom: 1px solid @borderColor; padding:0px 15px;}
	.build-nave{ margin-bottom: 15px;
		a{ color: @mainColor;}
	}
	dl{clear: both; overflow: hidden;
		dt,dd{ float: left;line-height: 40px;}
		dt{
			em{ display: inline-block; width: 10px; height: 10px; .border-radius(14px); margin-right: 10px; }
		}
		i{font-style: normal; margin-right: 15px;
		  &.up{ color: #5ecd44}
		  &.down{color: #55acee}
		}

	}
}

.subpanel{background-color: #f5f6f9; padding: 15px; border:1px solid @mainColor;.border-radius(3px);.box-shadow();
	.panel{ margin-bottom: 0px; background-color: transparent;
			.ipt-txt{ background-color: #fff}
	}
}
.options{
	.icon{display: inline-block; width: 20px; height: 20px; text-align: center; cursor: pointer; .border-radius(24px);line-height: 20px; vertical-align: middle;
		&:hover,&.on{ color: #fff; background-color: @mainColor;}

	}
}

/*文件上传表单*/
.fileupContent{padding:20px 25px;
	.fileUpTips{color: #999; padding-bottom: 20px}
	.fileuplayout{border:1px dashed @borderColor;  background-color: #f8f9fb; text-align: center; height: 217px;padding-top: 20px;
		.uploader-list{ width: 100%; margin-bottom: 10px; height: 20px;
		.item{ float: left; width: 100%; text-align: center;}
		}
	}
	.icon-excel,.icon-map{ font-size: 70px;color: #999;
		&.on{color:@mainColor;background: transparent;}
	 }
	.webuploader-pick{border:none; background-color: @mainColor;
		&.webuploader-pick-hover{background-color: darken(@mainColor,10%)}
	}
}

.timeLine{ height: 15px; line-height: 15px; position: relative; margin-bottom: 20px;
		&.ON{background-color: @greenColor; }
		&.OFF{background-color: #f5f5f5;}
	//.timeline-layout{ height: 100%; width: 100%; overflow: hidden;position: relative;}
	.timecontent{ height: 100%;width: 100%;position: relative;
		span{display: inline-block; height: 100%;vertical-align: top;position: absolute;top:0;
			&.ON{background-color: @greenColor; }
			&.OFF{background-color: #f5f5f5;}
			&:hover{
				&.ON{background-color: darken(@greenColor,10%); }
				&.OFF{background-color: darken(#f5f5f5,10%);}
			}
		}
	}
	.timetitle{ position: absolute; left:0; top:20px; right: 0; bottom: 0; z-index: 20;
		b{position: absolute; top:0;}
	}
}

.resfrom{ margin-bottom: 5px;
	.ipt-txt{ width: 150px; vertical-align: middle;}
	.btn{ height: 30px; line-height: 30px; padding:0px 12px;}
}

.ui-jqdialog{
	.modal-header{background-color:transparent;}
	.ui-jqdialog-titlebar{ background-color: @mainColor;}
	.ui-jqdialog-titlebar-close{color:#fff; padding:3px;
		&:hover,&:focus{padding:3px;}
	}
}

.raido-content{
	clear:both; overflow: hidden;padding:0px 5px;
	li{float: left;padding:0px 5px; width: 100%;
		.radio-box{ border:1px solid @borderColor; background-color: #f8f9fb;
			h5{padding:5px;}
		}
	}
 }

.prototype-panel{width: 220px; overflow: auto;
	.ap-locName{ font-size: 16px;color:@mainColor; line-height: 30px; font-weight: 800; margin-top: 10px}
	.ap-sn{line-height: 20px;}
	.item-box{ margin-top:15px;
		h4{font-weight: 600;}
		li{margin-top:10px;}
		.item-name{ display: inline-block;width: 50px; text-align: right; vertical-align: middle;}
		select.ipt-txt{width: 100px;}
	}
	.btn-list{ text-align: center; margin-top: 20px;}
}

.devs-upload{
	span{cursor: pointer;
		&:hover{color: @mainColor}
	}
}

.apneighborlogs{display:inline-block;
	.f-primary{color:@mainColor}
	span,label{vertical-align: middle;}
	label{
		margin-left:10px;
	}
}

.eginfo-box{
	padding:20px 35px;border:1px solid @mainColor;background-color: #f5f6f9;.border-radius(3px;);
	dl{ margin-bottom: 12px;line-height: 30px;}
	dt{ width: 100px; height: 30px; }
	.edit{display: none;}
	&.statusoff{
		border-color:#ddd;
	}

}

.nave-tab{
	border-bottom: 1px solid @borderColor; line-height: 40px;position: relative;
		li{float: left; min-width: 80px; text-align: center;cursor: pointer; line-height: 44px;padding:0px 12px;
			&.selected{
				border-bottom: 3px solid #4d9dff;
			}
		}
		// .selectedbar{position: absolute; width: 80px;height: 3px; background-color: @mainColor;bottom: -1px;.transition(all,0.2s,linear);font-size: 0px;line-height: 0px;.border-radius();}
	}
.nave-tab-content{
	//.btn{padding:4px 12px;}
}
.radio-scanpanel-conetnt{
	dl{ clear:both;padding-left:150px;overflow: hidden;line-height: 34px;
		dt{ margin-left: -150px;float: left;}
		dd{
			.week-content{
				label{margin-right: 15px;}
			}
			&.checkbox-content{
				label{margin-right: 15px;}
			}
		}
	}
}

.condition-list{
	border:1px solid @borderColor;background-color: #f8f9fb; margin-top: 20px;line-height: 30px;padding:15px 20px;
	li{position: relative;
		.icon-del{position: absolute; right:10px; width: 24px; height: 24px; line-height: 24px;.border-radius(99px); text-align: center;
			&:hover{ background-color:@mainColor; color:#fff;cursor: pointer;}
		}
		&:hover{color:@mainColor}
	}
}

.data-filter {
	.ipt-txt {height: 34px; line-height: 34px;}
	select[name="status"] {max-width: 120px;}
}

// 数据载入等待提示
.loading-data  {
	position: relative;
	&:after {
	 	background: url("../images/loading.gif") no-repeat left center;
		content: "读取中...";
		display: inline-block;
		position: absolute;
		padding-left: 45px;
		top: 50%;
		left: 50%;
		margin-left: -42px;
	 }
}

.icon-downward{
	font-size: 12px;
  	margin-left: 8px;
}

.sub-menu-ol {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 999;
	display: none;
	padding: 5px 0;
  	background: white;
  	border: 1px solid #ccc;
  	text-align: center;
  	font-size: 16px;
  	border: 1px solid rgba(0,0,0,.15);
  	min-width: 100px;
	.box-shadowcolor(0px, 6px, 12px, #000, .175);
	li.selected {
		>a {color: @mainColor;}
	}
	&.admin-ol {
		left: -20px;
	}
}
.mainmenu .sub-menu-li {
  	a {
  		padding: 3px 20px;
  		clear: both;
  		line-height: 36px;
  		min-width: 80px;
  		white-space: nowrap;
  		display: block;
  		color: @headFontColor;
  		&:hover {
  			color: @mainColor;
  		}
  	}
 }

.bgColor {
	background-color:@backgroundColor;
}

.head-help {
	font-size: 18px;
  	float: left;
  	&:hover{
		color: @mainColor;
	}
}

.head-alarm{
	font-size:18px;
	position: relative;
	b{position: absolute;font-size: 12px;top:-5px;left:10px;.border-radius(999px);color: #fff;background-color: #f00; height: 16px; line-height: 16px; padding:0px 4px;}
	&:hover{color: @mainColor;}
}

.message-center-panel{
	position: relative;display: none;
	.message-center-list{
		position: absolute;top:1px;right: -100px; background-color:#fff;.box-shadowcolor(0px, 1px, @blur: 5px, @shadowColor, .7); z-index: 9999;padding:15px 0px 10px 0px;
		a{font-size: 14px;}
		ol{max-height: 300px; overflow-y: auto;overflow-x:hidden;}
		li{ line-height: 24px; width: 250px; float: none; text-align: left; clear: both; margin:0px 15px 0px 10px;padding:0px;}
		.view-all{ line-height: 24px; width:250px;

		}
	}
}

.message-box{ padding-left: 20px; padding-bottom: 5px;
	dt{margin-left: -20px;float: left; line-height: 18px;
		.read-sign{width: 10px; height: 10px; .border-radius(50%); background-color: #cecece;display: inline-block;.box-shadowcolor(0px, 1px, @blur: 3px, @shadowColor, .7);
		}
	}
	dd{
		word-break:break-all;word-wrap:break-word; line-height: 20px;
	}
	&.no{
		.read-sign{background-color: #87d04d}
	}
	.title{ font-size: 12px}
	.content{color:#b8b8b8; font-size: 12px; max-height: 40px; overflow: hidden;text-overflow: ellipsis;white-space: pre;}
}
.message-info-title{ font-weight: bold;}
.message-info-body{ margin-top:10px;font-size:12px;text-indent: 24px;line-height: 1.8; color:#000}
.admin-menu {
	height: 80px;
	.admin-menu-a {
		display: inline-block;
  		vertical-align: top;
  		&:hover {
  			color: @mainColor;
  		}
	}
}

.mainmenu.admin-menu >ul >li {
	&:hover{
		.message-center-panel{display: block;}
	}
	&.span-li{
			a{
				&.admin-menu-add{
					font-size: 14px;
					.icon{font-size: 18px;}
					.item{border-right:1px solid #ccc; padding:0px 20px}
					.box{background-color: @mainColor;color:#fff; padding:5px 10px; .border-radius(99px);  }
				}
				.icon{border-right: none; padding:0px}
			}
		}

	>a {
		padding-right: 0px;
		padding-left: 0px;
		&:hover {
			padding-top: 30px;
			border: none;
		}
	}

	.icon {
		padding-right: 15px;
		padding-left: 15px;
		border-right: 1px solid #ccc;
	}

	.icon-user.icon{
		padding-right: 0px;
		border-right: none;
	}
}


span.rui-validator-tip-txt {
	word-break:normal;
}

.panel.bottom {
	margin-bottom: 0px;
}

.memo-title {
	font-weight: normal;
  font-size: 12px;
  color: #999;
}

.potal-Content{
	dl{ padding-left: 210px;line-height: 32px;
		dt{width:210px; float: left;; margin-left: -210px}
	}
}

.potal-Content.dot1x{
	dl{ padding-left: 100px;line-height: 32px;
		dt{width:100px; float: left;; margin-left: -100px}
	}


}

.potal-panel{
	padding:10px 18px;border:1px solid @mainColor;background-color: #f5f6f9;margin-bottom: 15px;
}

.tunnel-info{
	dl{padding-left: 150px; line-height: 35px; clear:both;
		dt{width: 150px; margin-left:-150px; float: left;}
		dd{}
	}
}

.group-panel{
	h3{ line-height: 44px; border-bottom:1px solid @borderColor}
	li{line-height: 30px; margin-top: 8px;padding:0px 10px; border:1px solid @borderColor;.border-radius();
		&.select{ border-color:@mainColor;background-color: #d8ecff;}
	}
	.group-list-title{font-weight: bold;}
	.group-box{
		position: relative;padding-right: 50px;cursor: pointer;
		.group-action{position: absolute;right: 0px;top:0px; line-height: 30px;}
	}
	.enable-btn{
		display: inline-block;width: 14px; height: 14px; vertical-align: middle;background-color: #ccc;.border-radius(50%);.box-shadow(0px,0px,3px,0.5);
		&.enable{
			background-color: #87d04d;
		}
	}
}

.table{
	.icon-ok{color:#60B838;
		&:hover{background-color: transparent; color:#60B838}
	}
	.icon-canel{color:#999;
		&:hover{background-color: transparent; color:#999}
	}
}

.loadbalance-action{ text-align: center;
	&>span{ display: inline-block; margin:0px 20px; cursor: pointer;
		&:hover{color:@mainColor}
	}
}

.view-action{margin:10px;}

.wlocation-span{
	li{height: 40px; line-height: 40px;}
	dl{ padding-left: 200px;
		dt{ width: 200px; margin-left: -200px;float: left;}
	}
}

/* 账户个人信息 start */
.user-self-info{padding-left: 120px;overflow: hidden; position: relative;
	.list-nave{position: absolute; width:120px; left: 0px; top:0px; bottom: 0px;
		li{line-height: 40px; cursor: pointer;margin-bottom: 10px;padding-left:27px;
			&.selected{border-left:3px solid @mainColor;border-top:1px solid @borderColor;border-bottom: 1px solid @borderColor; border-right: 1px solid #fff; margin-right: -1px;padding-left: 24px;}
		}
	}
	.list-content{width: 100%; border: 1px solid @borderColor;min-height:320px;}
}
.self-group {
	  padding: 20px;
}
.self-emailwarn-list{
	dl{ line-height: 40px;position: relative; margin: 15px;
		dd{position: absolute; right: 0px;top:0px; }
	}
}

.new-mobile-box,.new-mobile-code-box {
	display: none;
}

.edit {
	.new-mobile-box {
		display: block;
	}
	.new-mobile-code-box {
		display: none;
	}
}

.code {
	.new-mobile-box {
		display: none;
	}
	.new-mobile-code-box {
		display: block;
	}
}

.btn.self-resend-btn {
  line-height: 28px;
  padding: 0px 14px;
  background: white;
  color: #333;
  border: 1px solid #dadee5;
  font-size: 12px;
  .border-radius();
}

.self-cancel {
 	margin-left: 30px;
  	color: #999;
}
/* 账户个人信息 end */


.norequire{color:@mainColor}

/* 监控网点上的时区title */
.time-zone-title {
  font-size: 14px;
  line-height: 28px;
  color: @mainColor;
  margin-top: 10px;
  &>span {
  	 color: @headFontColor;
  }
}

.tab-box{
	.tab-action{margin-bottom: 10px;
		&>span{ cursor: pointer;
			&:hover{color:@mainColor}
			&>i {
				margin-right: 3px;
			}
		}
	}
}

.group-box{
	dl{width: 50%; float: left;clear: none;}
}

.contacts-list{ width: 250px; display: inline-block;vertical-align: middle;
	h3{line-height: 30px;  font-weight: bold;}
}
.multiple-select{ border:1px solid @borderColor;background-color: #fff;overflow: auto;
	li{padding:5px 10px;cursor: pointer; text-align: left;
		&.selected{ color: #fff; background-color: @mainColor}
	}
}
.select-action{display: inline-block; vertical-align: middle;}

.span-block-iconbtn{
	&:hover{color:@mainColor;cursor: pointer;}
}

.userIsolationConf-span{
	dl{ padding-bottom:15px; line-height: 40px;}
	dt{font-weight: bold;}
	dd{ padding-left:25px;}
}

.title-memo {
	font-weight: normal;
	font-size: 12px;
	color: #999;
	line-height: 1.5;
}

.overView-layout{
	padding:15px;

}

.mid-span-block{
	padding:10px 20px;margin-bottom: 20px; line-height: 32px; background-color: #fafafa;
	h2{font-size: 16px;}
	.item-tips{font-size: 12px; color:#999;padding:8px; line-height: 1.5}
	.item-list{padding-left:20px;}
	.itembox{ margin-top: 10px;}
	.item-body{padding-left: 20px;}
	[show-rule]{display: none}
	strong{font-weight: bold;}
}

.dtable{ display: table;
	dl{display:table-row;
		dt{width:220px;}
		dt,dd{display: table-cell;}
	}
}

.radio-plan-nave{ height: 38px;line-height: 38px; margin:10px 20px 0px 20px}

.silder-tips{ display: inline-block; height: 28px;line-height: 28px; border:1px solid #ddd; width: 60%}

.show-more{ position: absolute; bottom: 0; left: 0;right: 0;cursor: pointer; color: @mainColor;background-color: #fff;
	.icon{ background-color: @mainColor; color: #fff;}
}
@media screen and (max-width: 1200px) {
  .mainmenu {margin-left: -14px;
    >ul>li{
		>a{
			font-size: 16px;
		  	display: block;
  			padding: 30px 10px;
  			line-height: 20px;
		}
    }
  }
  .total-span > div.icon-border{ margin-right: 10px}
  .total-span > div.total-info span{font-size: 28px;}
  .monitor-devinfo .dev-span > ul > li p{padding-left: 20px;}
  .building-layout .building-total .info-typeicon{margin-right: 7px}
  .building-layout .building-total .total-info p{ font-size:12px;}
  .building-layout .building-total .total-info p > span{font-size: 24px;}
  .tplpanel h3 .pull-left{ max-width: 30%}

}
@media screen and (max-width: 1420px) {
	.time-action{position: static  !important;}
}


.ipt-txt-account-search{
	width:240px;
}

.ipt-txt-tenant-search{
	width:240px;
}

/* 在华为平板中，部分字体图标的点击事件不起作用，需要添加border或者display属性才可以 */
.icon-huawei{
	display: inline-block;
	cursor: pointer;
}

/* 在平板设备中，表格的标题无法完全显示，添加单词换行样式，但是这样会导致PC浏览器中也会有单词断行显示的情况，不太好 */
.ui-jqgrid .ui-jqgrid-htable thead th div {
	word-break: break-all;
}

/*设备诊断*/
.issues-sta-panel{
	.mac-list{height: 100%; overflow: hidden;
		li{border:1px solid #efefef; line-height: 30px; padding:0px 15px; cursor: pointer;margin-top: 10px;
			&.selected{border-color: @mainColor}
		}
	}
	.sta-info-panel{padding:15px 5px;
		h4{height: 32px; line-height: 32px; font-weight: bold;}
		.sta-info-span{ line-height: 2.4; margin-bottom: 20px;background-color: #fcfcfc;padding:5px;
			h3{font-weight: bold;}
		}

		.apInfo{
			&>div{padding:0px}
			dl{ padding-left:130px; float: left; height: 32px; line-height: 32px;
				dt{margin-left: -130px; width: 130px; text-align: right; float: left;}
			}
		}

		.issue-text{
			p{line-height: 28px; text-indent: 28px;}
		}

		.issue-process-step{font-size: 48px; padding:20px 0px 50px 40px;
			.icon-next{color: #bfbfbf; }
			i{position: relative;text-align: center;display: inline-block;width: 100px;
				&.icon-next{width: auto}
				p{position: absolute;font-size: 14px; font-weight:normal;color:#666; left: 0px;right:0px;}
			}
		}

		.issue-process-list{
			dl{ padding-left:130px; height: 32px; line-height: 32px;
				dt{margin-left: -130px; width: 130px; text-align: right; float: left;}
			}
		}
	}
}

.bate{
	position: relative;
	&:before{
		position: absolute;
		content: "beta";
		color: #f00;
		font-size: 12px;
		top:-15px;

	}
}

.network-start-content{width: 480px; margin:0px auto; margin-top:10%; font-size: 20px; line-height: 2;color:#999;font-family: '\5FAE\8F6F\96C5\9ED1';background:url(../images/network_new.gif) top center no-repeat;padding-top:220px;
	.icon{font-size: 16px}
}

.panel-network-devices{
	strong{font-weight: 700}
	.title{font-size: 18px;padding:15px 0px; border-bottom: 1px solid #ddd;
		.icon{font-size: 28px; margin-right:10px;}
	}
	.item{margin-right:15px; }
	em{display: inline-block;.border-radius(90px);border:1px solid #999; width: 24px; height: 24px;color:#999; text-align: center;margin-right: 8px}
	.items-list>li{
		padding:5px 0px;
	}
	.list-option{color:@mainColor;cursor: pointer;}

}

@boxBgColor:#f2f2f2;
.panel-network-network{
	.config-item-tips{color:#999}
	.box-panel{padding-left: 80px; border:1px solid @borderColor; min-height: 80px; margin-bottom: 20px;
		.box-panel-name{margin-left: -80px; float: left; text-align: center; width: 80px;line-height: 80px;}
		.box-panel-body{padding:10px 10px 10px 0px}
	}
	.singe-line{
		.box-panel-body{background-color:@boxBgColor;line-height: 80px; padding:0px 10px}
		.addressConfig {
			width:70px;
			height: 30px;
			vertical-align: middle;
			line-height: 30px;
			padding:0;
		}
	}
	.group-item-box{background-color: @boxBgColor;padding:10px;margin-bottom: 15px; margin-right:50px;position: relative;
		.del-group{position: absolute;right:-30px; font-size: 20px;cursor: pointer;top:0px;
			&:hover{color:@mainColor}
		}
	}
	.group-item-content{display: table; width: 100%; line-height: 30px;
		dl{display: table-row;
			dt,dd{display: table-cell;padding:5px 0px; }
			dt{width: 130px;}
		}
	}
	.moreConfig{cursor: pointer;color:@mainColor;}
}

.danger-msg{ background-color: #fdeae9;color: #eb4434; padding:10px;margin-bottom: 15px;position: relative;padding-right: 22px; line-height: 24px;.border-radius(5px);
	.icon-inlineCanel{ position: absolute; right: 10px; top:10px;color:#aca8a8;cursor: pointer;}
}

.ssidencode{
	background-color: #fff;margin-top:10px;position: relative;margin-right: 20px; padding: 10px;box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2); border-radius: 5px;
	.arrow{
		position: absolute;display: block;width: 0;height: 0; border-color: transparent;border-style: solid;border-width: 11px;top: -11px;left: 50%;margin-left: -11px;border-top-width: 0;border-bottom-color: #999;border-bottom-color: rgba(0,0,0,.25);
		&:before{border-width: 11px;position: absolute;display: block; width: 0;height: 0;border-color: transparent;border-style: solid;content: " ";    top: 0px;margin-left: -11px; content: " ";border-top-width: 0;border-bottom-color: #fff;
		}
	}

}

#SingleEquimentDialog{
	.modal-dialog{
	 width: 300px;
	 	#J_Equi_type{
			display: block;
			margin-bottom: 8px;
		}
	}
}

#mapDom {
	width: 300px;
	height: 150px;
	margin-top: 20px;
}
.amap-sug-result{
	z-index: 100000;
}
.emptydevice-panel{border:1px solid @borderColor;line-height: 30px;
	h4{font-weight: bolder;  border-bottom: 1px solid @borderColor;padding:0px 10px;background-color: #fafafa;}
	.emptydvice-tips{padding:0px 15px; color:#ccc}
	.emtpydevice-box{background-color: #fff;
		border-top:1px solid @borderColor; padding:0px 15px;
		.emptydevice-title{font-weight: bolder;}
		.emptydevice-body{font-size: 12px; color:#ccc}
	}

}

#selectGroupHint{
	line-height: 15px;
	color:#ccc;
	width: 200px;
	margin-top: 2px;
}

#addNetGroupHint {
	line-height: 15px;
	color:#ccc;
	margin-bottom: 5px;
}

.raido-plan-tab{ border-bottom: 1px solid @borderColor;overflow: hidden;
	&>li{float: left;cursor: pointer; line-height: 40px;padding:0px 30px;
		&.selected{background-color: #fff;border-bottom:3px solid @mainColor;}
	}

}
#alterPsd {
	margin-right: 20px;
}
#compatible{
	display: none;
	position:absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7f000000',endColorstr='#7f000000');
	z-index: 1000;
	top:0;
	left: 0;
	.compatible_box {
		width: 600px;
		height: 300px;
		background-color: rgba(0,0,0,0.6);
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#7f000000',endColorstr='#7f000000');
		border-radius: 8px;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -300px;
		margin-top: -150px;
		padding: 15px;
		.warn-icon{
			display: inline-block;
			width: 60px;
			height: 60px;
			// background: url(../images/warn.jpg);
			// background-size: cover;
			position: absolute;
			left: -22px;
			top: -27px;
		}
		.closeBtn{
			font-size: 28px;
			font-weight: 600;
			position: absolute;
			top: 17px;
			right: 17px;
			color: #ccc;
			border-radius: 100px;
			cursor: pointer;
			// border:3px solid #ccc;
			font-style: normal;
			width: 30px;
			height: 30px;
			text-align: center;
			line-height: 30px;
		}
		// .icon {
		// 	position: absolute;
		// 	top: -50%;
		// 	left: -50%;
		// 	font-size: 30px;
		// 	color:red;
		// }
		.content {
			border-radius: 8px;
			background-color: white;
			width: 570px;
			height: 270px;
			margin: 0 auto;
			padding: 20px;
			h3 {
				font-weight: 600;
				font-size:37px;
				margin-top: 20px;
			}
			p {
				margin-top: 20px;
				font-size: 25px;
			}
		}
	}
}
#dev_jqgrid_container_all .ui-jqgrid-htable {
	width:100%!important;
}
#dev_jqgrid_all {
	width: 100%!important;
}
